import React, { useState, useEffect } from "react";
import {InputNumber, Button } from "antd";
import "../index.css";
const App = ({ handleCancel }) => {
  const onChange = (value) => {
    console.log(`selected ${value}`);
  };
  return (
    <>
      <div
        className="content-top h-[480px]"
        onClick={(e) => e.stopPropagation()}
      >
        <div className="flex flex-col text-[14px] text-theme-text-default  mb-[24px]">
          <p className="font-semibold">这是单个向量中可以存在的字符的最大长度</p>
          <span className="mb-[12px] text-[13px] text-theme-modal-tips">文本块大小（最大1000）</span>
          <InputNumber
            className="w-full ant-input-number"
            controls={true}
            min={1}
            max={1000}
            defaultValue={3}
            onChange={onChange}
          />
        </div>

        <div className="flex flex-col text-[14px]">
          <p className="font-semibold">文本块重叠</p>
          <span className="mb-[12px] text-[13px] text-theme-modal-tips">这是在两个相邻文本块之间分块期间发生的最大字符重叠</span>
          {/* <Input placeholder="在此输入" suffix="重置" /> */}
          <InputNumber
            className="w-full ant-input-number"
            controls={true}
            min={1}
            max={1000}
            defaultValue={3}
            onChange={onChange}
          />
        </div>
      </div>
      <div className="content-bottom flex items-center justify-end">
        <Button color="default" variant="link" onClick={handleCancel}>
          取消
        </Button>
        <Button type="link">重置</Button>
        <Button color="primary" variant="link">
          保存
        </Button>
      </div>
    </>
  );
};
export default App;
